window.onload=function(){
	var button=document.getElementById('button');
	var second=document.getElementsByClassName('second')[0];
	button.onclick=function(){
		// 设置弹出二维码的代码
		if(second.style.opacity=="1"){
			second.style.opacity="0";
		}else{
			second.style.opacity="1";
		}
		return false;
	}


			// 设置大总管变量
            var index = 0;
            // 获取ul
            var ul = document.querySelectorAll(".banner ul")[0];
            // 获取所有点
            var dian = document.getElementsByClassName("point")[0].getElementsByTagName("span");
            // 设置第一个点的样式
            dian[index].style.background = "transparent";
            dian[index].style.border = "1px solid #fff";
            dian[index].style.transform = "scale(1.2)";

            // 自动轮播函数
            function show(){
                // 每次让总管变量++
                index ++;
                // 如果大于点的长度则让总管变量归零
                if(index > 2){
                    index = 0;
                }

                // 设置ul的left值为总管变量*-100加上百分号
                ul.style.left = index * -100 + "%";
                for(var i = 0; i < dian.length; i ++){
                    // 让所有点设置背景白色，不要边框
                    dian[i].style.background = "#fff";
                    dian[i].style.border = "1px solid transparent";
                    dian[i].style.transform = "scale(1)";
                }
                // 再单独控制正在轮播的点
                dian[index].style.background = "transparent";
                dian[index].style.border = "1px solid #fff";
                dian[index].style.transform = "scale(1.2)";           
            }
            // 自动轮播，3秒执行一次
            var time = setInterval(show,5000);

            // 循环给每一个点加点击事件
            for(var i = 0; i < dian.length; i ++){
                // 把序号存入每一个点
                dian[i].num = i;
                // 每一个点点击的时候执行的函数
                dian[i].onclick = function(){
                    // 清除定时器
                    clearInterval(time);      
                    // 让总管变量等于点的序号                 
                    index = this.num;
                    // 设置ul的left值
                    ul.style.left = this.num * -100 + "%";
                    // 循环让每个点设置默认样式
                    for(var i = 0; i < dian.length; i ++){
                        dian[i].style.background = "#fff";
                        dian[i].style.border = "1px solid transparent";
                        dian[i].style.transform = "scale(1)";
                    }             
                    // 被点击的点设置样式      
                    dian[index].style.background = "transparent";
                    dian[index].style.border = "1px solid #fff";
                    dian[index].style.transform = "scale(1.2)";
                }
            }




                // 当鼠标滚滚动到多少时，让menu改变高度和背景,让logo改变背景
                window.onscroll = function () {
                    // 获取滚动条距离
                    var t = document.documentElement.scrollTop || document.body.scrollTop;
                    // 获取header元素
                    var header = document.getElementsByClassName("header")[0];
                    // 获取menu里的a标签
                    var menu = document.getElementsByClassName("menu")[0].getElementsByTagName("a");
                    // 获取logo
                    var logo = document.getElementsByClassName("logo")[0];
                    // 获取logo里的图片
                    var logoImg = logo.getElementsByTagName("img")[0];
                    // 获取lan元素
                    var lan = document.getElementsByClassName("lan")[0];
                    if (t >= 900) {
                        // 改变每个a标签的颜色和行高
                        for(var i = 0; i < menu.length; i ++){
                            menu[i].style.color = "#999";
                            menu[i].style.lineHeight = "60px";
                            menu[i].style.height = "60px";
                        }
                        // 改变header的高度和颜色
                        header.style.background = "#fff";
                        header.style.height = "60px";
                        header.style.boxShadow = "0 0 10px #999";
                        // 改变logo的高度
                        logo.style.height = "60px";
                        logo.style.padding = "20px 30px";
                        // 改变logo图片的位置
                        logoImg.style.transform = "translateY(-20px)";
                        // 改变lan的样式
                        lan.style.height = "60px";
                        lan.style.lineHeight = "60px";
                        lan.style.color = "#999";
                    }else{
                        // 改变每个a标签的颜色和行高
                        for(var i = 0; i < menu.length; i ++){
                            menu[i].style.color = "#fff";
                            menu[i].style.lineHeight = "80px";
                            menu[i].style.height = "80px";
                        }
                        // 改变header的高度和颜色
                        header.style.background = "";
                        header.style.height = "80px";
                        header.style.boxShadow = "";
                        // 改变logo的高度
                        logo.style.height = "80px";
                        logo.style.padding = "30px 30px";
                        // 改变logo图片的位置
                        logoImg.style.transform = "translateY(0)";
                        // 改变lan的样式
                        lan.style.height = "80px";
                        lan.style.lineHeight = "80px";
                        lan.style.color = "#fff";
                    }
                }
}